function createOverviewScoreCharts(boutXML, home, away, firstPeriod, secondPeriod) {
    var numJams = $(firstPeriod).find('jam').length + $(secondPeriod).find('jam').length;
    var padLeft = 20;
    var padTop = 20;
    var padBottom = 40;
    var width = 892 - padLeft;
    var height = 250 - padBottom;
    var jamTimes = [];
    var totalJamTime = 0;
    var hasJamTimes = false;
    var period2StartsAt = 0;
    $([firstPeriod, secondPeriod]).find('jam').each(function(index, jam) {
        // find the jam duration - if not...
        var jamDuration = JamDuration(jam);
        jamTimes.push(jamDuration);
        totalJamTime += jamDuration;
        if (jamDuration != 90 && jamDuration != 120) {
            hasJamTimes = true;
        }
    });
    jamTimes.push(90); // for the end???
    var widthPerJam = width / (totalJamTime / 90 + 2);
    var chartData = [];
    var homeFinal = PeriodScore(firstPeriod, home) + PeriodScore(secondPeriod, home);
    var visitorFinal = PeriodScore(firstPeriod, away) + PeriodScore(secondPeriod, away);
    var totalHome = 0;
    var totalVisitor = 0;
    var left =0 ;
    var yPixelsPerTotalScore = height / (Math.max(homeFinal, visitorFinal) + 10)
    var maxScorePerJam = 0;
    var maxDiffPerJam = 0;
    var maxTotalDiffPerJam = 0;
    $([firstPeriod, secondPeriod]).find('jam').each(function(gameJamIndex, value) {
        var homePts = JamPoints(value, home);
        var awayPts = JamPoints(value, away);
        var barWidth = jamTimes[gameJamIndex] * widthPerJam / 90;
        var jamDuration = ''
        if (hasJamTimes) {
            jamDuration = formatMSS(jamTimes[gameJamIndex]); 
        } else {
            if (jamTimes[gameJamIndex] >= 120) {
                jamDuration = "2:00";
            } else {
                jamDuration = "";
            }
        }
        var maxDiffScorePerJam = Math.max(maxDiffScorePerJam,Math.abs((totalHome+homePts) - (totalVisitor+awayPts)))
        totalHome += homePts;
        totalVisitor += awayPts;
        var chartDatum = {
            x:padLeft + left, 
            width: barWidth, 
            jamDuration: jamDuration,
            home: {
                totalScore: totalHome, 
                score: homePts, 
                totalScoreY: height - yPixelsPerTotalScore * (totalHome),
                totalDiff: Math.max(0,(totalHome) - (totalVisitor)),
                diff: Math.max(0,homePts - awayPts)
            },
            away: {
                totalScore: totalVisitor, 
                score: awayPts, 
                totalScoreY: height - yPixelsPerTotalScore * (totalVisitor),
                totalDiff: Math.max(0,(totalVisitor) - (totalHome)),
                diff: Math.max(0,awayPts - homePts)
            }
        };
        if (firstPeriod.childElementCount == gameJamIndex) { // first jam of second period
            period2StartsAt = left;
        }
        chartData.push(chartDatum);
        left += barWidth;
        maxScorePerJam = Math.max(maxScorePerJam,Math.max(homePts, awayPts));
        maxDiffPerJam = Math.max(maxDiffPerJam, Math.max(chartDatum.home.diff, chartDatum.away.diff));
        maxTotalDiffPerJam = Math.max(maxTotalDiffPerJam, Math.max(chartDatum.home.totalDiff, chartDatum.away.totalDiff));
    });
    maxScorePerJam += 10; // add some padding
    DXML.chart_score_global = {
        period2Starts: firstPeriod.childElementCount,
        period2StartsAt: period2StartsAt,
        width: width + padLeft,
        height: height + padBottom,
        spacingX: widthPerJam,
        padTop: padTop,
        padBottom: padBottom,
        padLeft: padLeft,
        homeColor: $(home).attr('color') || "darkgray",
        awayColor: $(away).attr('color') || "lightgray",
        homeIcon: DXML.homeIcons.tiny,
        awayIcon: DXML.awayIcons.tiny
    };
    DXML.chart_scoredata = chartData;
    BuildTotalScoreChart('chart_totalscoreperjam',DXML.chart_scoredata,Math.max(homeFinal, visitorFinal) + 10);
    BuildScoreChart('chart_scoreperjam', DXML.chart_scoredata,maxScorePerJam, 'score');
    BuildScoreChart('chart_totalscorediffperjam', DXML.chart_scoredata,maxTotalDiffPerJam, 'totalDiff');
    BuildScoreChart('chart_scorediffperjam', DXML.chart_scoredata,maxDiffPerJam+10, 'diff');
}

function prepareOverviewPage() {
    if (!DXML.firstPeriod) {
        return;
    }
    var h1 = PeriodScore(DXML.firstPeriod,DXML.homeTeam)
    var h2 = PeriodScore(DXML.secondPeriod,DXML.homeTeam)
    var a1 = PeriodScore(DXML.firstPeriod,DXML.awayTeam)
    var a2 = PeriodScore(DXML.secondPeriod,DXML.awayTeam)
//    Tempo.prepare($(".banner")).render({}).clear();
//    Tempo.prepare($(".matchup")).render({}).clear();
//    Tempo.prepare($("#rosters")).render([{},{}]).clear();
//    Tempo.prepare($(".boxscore")).render([{},{}]).clear();
    
    Tempo.prepare( $('.banner') ).render( {
        date: $(DXML.boutXML).attr('date'),
        location: $(DXML.boutXML).attr('location'),
        city: $(DXML.boutXML).attr('city'),
        state: $(DXML.boutXML).attr('state')
    } );
    Tempo.prepare( $('.matchup') ).render( {
        away:{
            name: extractName(DXML.awayTeam, DXML.homeTeam),
            score: a1+a2,
            winLoss: a1+a2 > h1 + h2 ? "win" : "loss"
        },
        home:{
            name: extractName(DXML.homeTeam, DXML.awayTeam),
            score: h1+h2,
            winLoss: h1+h2 > a1 + a2 ? "win" : "loss"
        } 
    });
    Tempo.prepare( $('#rosters') ).render( [{
        side: "visitor",
        name: extractName(DXML.awayTeam, DXML.homeTeam),
        roster: extractRoster(DXML.awayTeam, 1)
    }, {
        side: "home",
        name: extractName(DXML.homeTeam, DXML.awayTeam),
        roster: extractRoster(DXML.homeTeam, 1)
    }] );
    Tempo.prepare( $('.boxscore')).render([{
        name: extractName(DXML.awayTeam, DXML.homeTeam),
        p1:a1,
        p2:a2,
        total:a1 + a2,
        majors:MajorPenalties(DXML.firstPeriod,DXML.awayTeam) + MajorPenalties(DXML.secondPeriod,DXML.awayTeam)
    }, {
        name: extractName(DXML.homeTeam, DXML.awayTeam),
        p1:h1,
        p2:h2,
        total:h1 + h2,
        majors:MajorPenalties(DXML.firstPeriod,DXML.homeTeam) + MajorPenalties(DXML.secondPeriod,DXML.homeTeam)
    }]);
    $( "#scorecharts" ).tabs();
    createOverviewScoreCharts(DXML.boutXML, DXML.homeTeam, DXML.awayTeam, DXML.firstPeriod, DXML.secondPeriod);
    oddEvenTables();
}


